<template>
	<view>
		<uni-head title="理赔详情"></uni-head>
		<view style="height: 1px; background-color: #EEEEEE;"></view>
		<view style="background-color: #fff;">
			<view class="statusbox">
				<view class="info">理赔材料已寄出</view>
				<view class="understand">资料不全，缺少医院证明，请尽快补齐</view>
			</view>
			<view class="titlesm flex">
				<view class="blueshu"></view>
				<view class="shuoming">收货地址</view>
			</view>
			<view class="congst">
				<view class="topbox flex">
					<view class="left">{{infodata.name}}</view>
					<view class="right">{{infodata.mobile}}</view>
				</view>
				<view class="bottom">
					{{infodata.address}}
				</view>
			</view>
		</view>
		<view style="background-color: #FFF;margin-top: 20upx;">
			<view class="titlesm flex">
				<view class="blueshu"></view>
				<view class="shuoming">邮寄记录</view>
			</view>
			<view class="listbox" v-for="(item,index) in 4" :key='index'>
				<view class="topbox flex-space-between">
					<view class="flex">
						<view class="kuaidi">中通快递</view>
						<view class="danhao">24613546345</view>
					</view>
					<view class="imgbox flex" @click="fzclick">
						<image src="../../static/Icon/fz.png" mode=""></image>
						<view >复制</view>
					</view>
				</view>
				<view class="buttombox">
					2022-11-20 10:12
				</view>
			</view>
		</view>
		<view class="" style="overflow: hidden;">
			<view class="butbox" @click="yjiclick">
				确认邮寄
			</view>
		</view>
	</view>
</template>

<script>
	import uniHead from "@/components/uni-dead/head.vue";
	import {setClipboardData,navTo} from '../../utils/method.js'
	export default {
		components: { uniHead },
		data() {
			return {
				id:'',
				infodata:{},
				logistics:[]
			}
		},
		onLoad(id) {
			this.id=id.id
			this.initdata()
		},
		methods: {
			// 初始数据
			initdata(){
				this.ajax('report/getLogistics',{
					data:{
						id:this.id
					},
					success:(res)=>{
						console.log(res);
						this.infodata=res.msg.address//收货地址
						this.logistics=res.msg.logisticss
					}
				})
			},
			yjiclick(){
				navTo('/pages/order/Lpinfo?id='+this.id)
			},
			// 点击复制
			fzclick(){
				setClipboardData()
			}
		}
	}
</script>

<style lang="less" scoped>
.statusbox{
	margin:0 24upx;
	overflow: hidden;
	.info{
		margin-top: 56upx;
		font-size: 36upx;
		color: #71A54F;
		font-weight: bold;
	}
	.understand{
		font-size: 28upx;
		padding: 24upx;
		background-color: #FFF9F5;
		color: #F86768;
		margin: 50upx 0;
	}
}
.titlesm{
	margin:0 24upx;
	padding-top: 28upx;
	padding-bottom: 26upx;
	border-bottom: 1px solid #EEEEEE;
	font-size: 28upx;
		
		.blueshu{
			width: 6upx;
			height: 20upx;
			background: #5081FA;
			border-radius: 4upx;
			margin-right: 10upx;
		}
}
.congst{
	margin:0 24upx;
	padding: 50upx 0;
	// margin-left: 14upx;
	
	width: 520upx;
		.topbox{
			color: #000000;
			font-size: 28upx;
			.left{
				margin-right: 14upx;
			}
		}
		.bottom{
			margin-top: 18upx;
			color: #999999;
			font-size: 28upx;
		}
}
.listbox{
	margin: 0 24upx;
	padding: 24upx 0;
	.topbox{
		color: #000000;
		font-size: 28upx;
		.danhao{
			margin-left: 20upx;
		}
		.imgbox{
			
			image{
				width: 32upx;
				height: 32upx;
				margin-right: 8upx;
			}
			view{
				color: #777777;
				font-size: 28upx;
				
			}
		}
	}
	.buttombox{
		margin-top: 14upx;
		font-size: 28upx;
		color: #999999;
	}
}
.butbox{
	// margin-top: 152upx;
	font-size: 32upx;
	color: #fff;
	height: 100upx;
	line-height: 100upx;
	text-align: center;
background: linear-gradient(180deg, #4EB4FE 0%, #5280F8 100%);
	margin: 52upx 24upx 40upx;
	
	border-radius: 10upx;
}
</style>
